JQuery

How to iterationg and modifying array with jQuery.map ?

How to iterationg and modifying array with jQuery.map ?, someone asked me to explain?
By:

In this article we will learn how to iterationg and modifying array with jQuery.map. We can loop each element in the array and modify the value.$.map(). The $.map() method will takes the array and callback method as argument, while iterating using substring we are taking first 3 letters.

Example:

 

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>month abbrevation with jQuery.map</title>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var months = ['January', 'February', 'March', 'April', 'May',
          'June', 'July', 'August', 'September', 'October',
          'November', 'December'];
            months = $.map(months, function (value, i) {
                return "abbrevation for the month of " + value + " is <b style='color:black'>" + value.substr(0, 3) + "</b>";
            });
            $('#divResult').html("<li >" + months.join("</li><li>") + "</li>");
        });
    </script>
    <style type="text/css">
        div {
            display: inline-block;
            float: left;
            color: #fff;
            font-size: 18px;
            padding-left: 5px;
            text-align:center;
        }
         .content {
            width: 450px;
            height: 250px;
            background: purple;
        }
    </style>
</head>
<body>
    <div class="content" id="divResult"></div>
</body>
</html> 

Output:

iterationg and modifying array with jQuery map

Related Article

Post your comments / questions



Recent Article